<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@taglib prefix="s" uri="/struts-tags" %>
<html>
<head>
    <title>Title</title>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/static/css/layui.css">
</head>
<body class="layui-bg-gray" >
    <div class="layui-container layui-bg-gray">
		<div class="layui-card">
		  <div class="layui-card-header">用户登录</div>
		  <div class="layui-card-body">
			<form action="login.action" method="post" class="layui-form">
				<div class="layui-form-item">
					<label class="layui-form-label">用户名</label>
					<div class="layui-input-block">
						<input type="text" name="username" required  lay-verify="required" placeholder="请输入用户名" autocomplete="off" class="layui-input">
					</div>
				</div>
				<div class="layui-form-item">
					<label class="layui-form-label">密 码</label>
					<div class="layui-input-block">
						<input type="password" name="password" required  lay-verify="required" placeholder="请输入用户名" autocomplete="off" class="layui-input">
					</div>
				</div>
				<div class="layui-form-item" align="center">
					<input type="submit" value="登录" class="layui-btn layui-btn-normal">
				</div>
			</form>
		  </div>
		</div>
    </div>
    <script src="${pageContext.request.contextPath}/static/layui.js"></script>
    <script>
        layui.use(function(){
            var layer = layui.layer
                ,form = layui.form
                ,laypage = layui.laypage
                ,element = layui.element
                ,laydate = layui.laydate
                ,util = layui.util;

            //触发事件
            util.event('test-active', {
                'test-form': function(){
                    layer.open({
                        type: 1
                        ,resize: false
                        ,shadeClose: true
                        ,area: '350px'
                        ,title: 'layer + form'
                        ,content: ['<ul class="layui-form layui-form-pane" style="margin: 15px;">'
                            ,'<li class="layui-form-item">'
                            ,'<label class="layui-form-label">输入框</label>'
                            ,'<div class="layui-input-block">'
                            ,'<input class="layui-input" lay-verify="required" name="field1">'
                            ,'</div>'
                            ,'</li>'
                            ,'<li class="layui-form-item">'
                            ,'<label class="layui-form-label">选择框</label>'
                            ,'<div class="layui-input-block">'
                            ,'<select name="field2">'
                            ,'<option value="A">A</option>'
                            ,'<option value="B">B</option>'
                            ,'<select>'
                            ,'</div>'
                            ,'</li>'
                            ,'<li class="layui-form-item" style="text-align:center;">'
                            ,'<button type="submit" lay-submit lay-filter="*" class="layui-btn">提交</button>'
                            ,'</li>'
                            ,'</ul>'].join('')
                        ,success: function(layero, index){
                            layero.find('.layui-layer-content').css('overflow', 'visible');

                            form.render().on('submit(*)', function(data){
                                layer.msg(JSON.stringify(data.field), {icon: 1});
                                //layer.close(index); //关闭层
                            });
                        }
                    });
                }
            });
        });
    </script>
</body>
</html>
